import 'package:flutter/material.dart';
import 'password_login.dart';
import 'package:flutter_demo/views/login/verification_code_login.dart';
import 'dart:ui';

class LoginPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _LoginPageState();
  }
}

class _LoginPageState extends State<LoginPage>
    with SingleTickerProviderStateMixin {
  TabController _tabController;
  Color _greenColor = Color.fromARGB(255, 0, 213, 142);
  ScrollController _controller = new ScrollController();

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: 2, vsync: this);
    _controller.addListener(() {
      print(_controller.offset); //打印滚动位置
    });
  }

  @override
  void dispose() {
    super.dispose();
    _tabController.dispose();
    _controller.dispose();
  }

  BoxDecoration _buildBackgroundDecorationBox() {
    return BoxDecoration(
        gradient: LinearGradient(
            colors: [const Color(0xff49dfc3), const Color(0xff00cb92)],
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter));
  }

  BoxDecoration _buildStackBackgroundDecorationBox() {
    return BoxDecoration(
        border: Border.all(color: Colors.white, width: 2.0), //边框线条
        borderRadius: BorderRadius.circular(8.0), //圆角
        color: Colors.white, //背景颜色
        boxShadow: <BoxShadow>[
          //阴影
          BoxShadow(color: Colors.black, blurRadius: 8.0)
        ]);
  }

  Widget _buildTopImage() {
    return Padding(
      padding: EdgeInsets.only(bottom: 20.0),
      child: Image.asset(
        'assets/images/ic_launcher.png',
        height: 80,
        width: 80,
      ),
    );
  }

  Widget _buildTabBar() {
    return TabBar(
        tabs: <Widget>[Tab(text: '密码登录'), Tab(text: '验证码登录')],
        controller: _tabController,
        labelColor: _greenColor,
        indicatorPadding: EdgeInsets.only(left: 40.0, right: 40.0),
        unselectedLabelColor: Color.fromARGB(255, 0xdd, 0xdd, 0xdd),
        indicatorColor: _greenColor,
        indicatorWeight: 2.0);
  }

  Widget _buildTabBarViewContainer() {
    return Container(
        margin: EdgeInsets.only(left: 2.0, right: 2.0, bottom: 2.0),
        height: 250.0,
        child: TabBarView(controller: _tabController, children: <Widget>[
          PassWordLoginWidget(),
          VerificationCodeWidget()
        ]));
  }

  @override
  Widget build(BuildContext context) {
    double screenHeight = MediaQuery.of(context).size.height;
    double stateBarHeight = MediaQueryData.fromWindow(window).padding.top;
    double contentHeight = screenHeight - stateBarHeight;
    print(
        'screenHeight=$screenHeight, stateBarHeight=$stateBarHeight,contentHeight=$contentHeight');

    return SingleChildScrollView(
      //利用ScollView来处理当输入框存在时,出现的Bottom overflow
      controller: _controller,
      child: Container(
        height: contentHeight,
        decoration: _buildBackgroundDecorationBox(),
        padding: EdgeInsets.only(top: 60),
        child: Column(
          children: <Widget>[
            _buildTopImage(),
            Stack(
              alignment: Alignment.topCenter,
              overflow: Overflow.visible,
              children: <Widget>[
                Image.asset('assets/images/bg_login_green.png'),
                Container(
                  margin:
                      EdgeInsets.symmetric(vertical: 40.0, horizontal: 20.0),
                  decoration: _buildStackBackgroundDecorationBox(),
                  child: Column(
                    children: <Widget>[
                      _buildTabBar(),
                      _buildTabBarViewContainer()
                    ],
                  ),
                )
              ],
            )
          ],
        ),
      ),
    );
  }
}
